<template>
  <div>
    <p>首页</p>
    <el-row class="index-main">
      <div class="carousel">
        <el-carousel :interval="5000" arrow="always" height="300px">
          <el-carousel-item v-for="item in 4" :key="item">
            <div class="body"></div>
          </el-carousel-item>
        </el-carousel>
      </div>
      <div class="carousel1">
        <list height="300px"></list>
      </div>
      <el-col>
        <list height="300px"></list>
      </el-col>
    </el-row>
  </div>
</template>

<script>
import {sessionStore} from '@/store/storage'
import editor from "@/components/tinymce"
import list from "@/components/list"

export default {
components: {editor,list},
mounted() {

  console.log(sessionStore.get("name"));
  sessionStore.set("name",'name')

}
}
</script>

<style lang="scss">
  .index-main {
    &>div {
      margin-bottom: 10px;
    }
    .el-carousel__item .body {
      background-color: #00a2d4;
      height: 100%;
      height: 100%;
    }

    .el-carousel__item:nth-child(2n) {
    }

    .el-carousel__item:nth-child(2n+1) {
    }

    .carousel {
      float: left;
      width: 450px !important;
    }

    .body {
      height: 100%;
      background-color: #00a2d4;
    }

    .carousel1 {
      float: left;
      width: calc(100% - 460px) !important;
      margin-left: 10px;

      &:after {
        clear: both;
      }

    }
  }
</style>